<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@ taglib uri="http://myfaces.apache.org/tomahawk" prefix="t"%>
<%@ taglib uri="http://richfaces.org/a4j" prefix="a4j"%>
<%@ taglib uri="http://richfaces.org/rich" prefix="rich"%>
<%@ taglib uri="http://jakarta.apache.org/struts/tags-tiles" prefix="tiles"%>

<rich:panel header="#{messages['member.booking.order.label']}">
	<h:panelGrid>
		<h:outputText value="#{errorBean.errorMessage}" styleClass="error"></h:outputText>
	</h:panelGrid>
	
	<h:panelGrid width="100%">
	    <h:outputText value="#{messages['add.member.itinerary.label']}" styleClass="sub_header" />
		<h:panelGroup>
			<h:outputText value="*" styleClass="standardText_Mandatory" />
			<h:outputText value="#{messages['instruction']}" styleClass="standardText_Instruction" />
		</h:panelGroup>
	</h:panelGrid>
			
	<t:panelGrid columns="2" columnClasses="standardTable_ColumnLeft_20,standardTable_ColumnLeft_80" width="100%">
		<h:outputText value="#{messages['package.code.label']}" styleClass="standardText_Label" />
		<h:outputText value="SRHPJ" styleClass="standardText" />
		
		<h:outputText value="#{messages['package.desc.label']}" styleClass="standardText_Label" />
		<h:outputText value="Sunway Resort Hotel - PJ" styleClass="standardText" />
		
		<h:panelGroup>
			<h:outputText value="*" styleClass="standardText_Mandatory" />
			<h:outputLabel for="memberAgreement" value="#{messages['member.agreement.label']}" styleClass="standardText_Label" />
		</h:panelGroup>
		<h:panelGroup>
			<t:selectOneMenu id="memberAgreement" styleClass="standardText" value="" required="true">
				<f:selectItem itemLabel="#{messages['please.select']}" itemValue="" />
				<f:selectItem itemLabel="Agreement 1" itemValue="" />
				<f:selectItem itemLabel="Agreement 2" itemValue="" />
			</t:selectOneMenu>
		</h:panelGroup>
		
		<h:panelGroup>
	    	<h:outputText value="*" styleClass="standardText_Mandatory" />	
		    <h:outputLabel for="checkInDate" value="#{messages['check.in.date.label']}" styleClass="standardText_Label" />
		</h:panelGroup>
		<h:panelGroup>
		    	<t:inputCalendar
		    	id="checkInDate"
					monthYearRowClass="yearMonthHeader" weekRowClass="weekHeader" 
					currentDayCellClass="currentDayCell" value=""
					renderAsPopup="true" popupTodayString="#{messages['popup.today']}"
					popupWeekString="#{messages['popup.week']}" popupDateFormat="dd/MM/yyyy"
					renderPopupButtonAsImage="true"
					styleClass="standardText" required="true"
		    	>
		    	</t:inputCalendar>
		</h:panelGroup>
		
		<h:panelGroup>
	    	<h:outputText value="*" styleClass="standardText_Mandatory" />	
		    <h:outputLabel for="checkOutDate" value="#{messages['check.out.date.label']}" styleClass="standardText_Label" />
		</h:panelGroup>
		<h:panelGroup>
		    	<t:inputCalendar
		    	id="checkOutDate"
					monthYearRowClass="yearMonthHeader" weekRowClass="weekHeader" 
					currentDayCellClass="currentDayCell" value=""
					renderAsPopup="true" popupTodayString="#{messages['popup.today']}"
					popupWeekString="#{messages['popup.week']}" popupDateFormat="dd/MM/yyyy"
					renderPopupButtonAsImage="true"
					styleClass="standardText" required="true"
		    	>
		    	</t:inputCalendar>
		</h:panelGroup>
	</t:panelGrid>

	<h:panelGrid width="100%">
		<h:outputText value="#{messages['package.element.label']}" styleClass="sub_header" />
	</h:panelGrid>
	
	<h:panelGrid width="100%" columns="1">
	    <h:panelGroup>
		    <rich:dataTable id="data" var="demo" value="#{demoBean.productList}" rows="20" width="99%">
				<rich:column style="text-align:center;width:20%;">
					<f:facet name="header">
						<h:outputText value="#{messages['product.code.column']}"></h:outputText>
					</f:facet>
					<h:outputText value="#{demo.label}"></h:outputText>
				</rich:column>
				
				<rich:column style="text-align:center;width:20%;">
					<f:facet name="header">
						<h:outputText value="#{messages['product.desc.column']}"></h:outputText>
					</f:facet>
					<h:outputText value="#{demo.action}"></h:outputText>
				</rich:column>
				
				<rich:column style="text-align:center;width:20%;">
					<f:facet name="header">
						<h:outputText value="#{messages['product.qty.column']}"></h:outputText>
					</f:facet>
					<h:outputText value="1"></h:outputText>
				</rich:column>
				
				<rich:column style="text-align:center;width:10%;">
					<f:facet name="header">
						<h:outputText value="#{messages['product.point.column']}"></h:outputText>
					</f:facet>
					<h:outputText value="1"></h:outputText>
				</rich:column>
			</rich:dataTable> 
		</h:panelGroup>
			
		<h:panelGroup>
			<h:panelGrid columns="2" align="right">
				<h:outputText value="#{messages['package.total.point.label']}" styleClass="standardText_Label" />
				<h:outputText value="3" styleClass="standardText" />
			</h:panelGrid>
		</h:panelGroup>
	</h:panelGrid>

	<rich:spacer height="10"></rich:spacer>
			
	<t:panelGrid columns="2" columnClasses="standardTable_ColumnLeft_20,standardTable_ColumnLeft_80" width="100%">
		<h:outputText></h:outputText>
		<t:panelGrid columns="2">
			<h:commandButton value="#{messages['submit']}" styleClass="button"></h:commandButton>
			<h:commandButton value="#{messages['back']}" styleClass="button"></h:commandButton>
		</t:panelGrid>
	</t:panelGrid>	
</rich:panel>
